<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../../include/taglib.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<%@include file="../../include/inhead.jsp"%>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
<meta name="keywords" content="E爱车 洗车 到店洗车" />
<meta name="description" content="E爱车" />
<link rel="shortcut icon" href="${ctx}/static/imges/favicon.ico" />
<title>到店洗车</title>

<link rel="stylesheet" type="text/css" href="${ctx}/static/css/autoinn/bootstrap/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/autoinn/font-awesome/css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/autoinn/slideNav.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/autoinn/washCar.css" />
<script type="text/javascript" src="http://api.map.baidu.com/api?ak=zV5nfPiCQxp1pBfTRyB3j4qO&v=2.0"></script>

</head>
	<style type="text/css">
		body {
			background-color: #f0efed;
		}
		.container {
			padding-left: 0px;
			padding-right: 0px;
		}
		.row {
			margin-left: 0px;
			margin-right: 0px;
		}
		.list-group-item:first-child {
			border-top-left-radius: 0px;
			border-top-right-radius: 0px;
		}
		.list-group-item:last-child {
			border-bottom-right-radius: 0px;
			border-bottom-left-radius: 0px;
		}
		.active a {
			color: #EF8A55;
		}
		a:hover {
			color: #919191;
			text-decoration: none;
		}
		.list-group-item:first-child {
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
		}
		.list-group-item:last-child {
			border-bottom-right-radius: 4px;
			border-bottom-left-radius: 4px;
		}
	</style>
	<script type="text/javascript" src="${ctx}/static/js/autoinn/jquery/jquery-1.7.min.js"></script>
	<script type="text/javascript" src="${ctx}/static/js/autoinn/bootstrap/bootstrap.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/convertor.js"></script>
	</head>

	<body>
		<div class="container">

			<div class="orange-orange-a row pf text-center border-1 bdc-e6e6e6 bgc-f8f8f8 pt-5 pb-5 z99 w h45 " style="left: 0; top: 0;">
				<div class="col-xs-4 line-height-35 text-left pl-15 pr-0 pt-0">
				</div>
				<div class="col-xs-4 line-height-35 f18 pr-0 pl-0 text-center">洗车行列表</div>
				<div class="col-xs-4 line-height-35 text-right">
				 	<a id="ca" href="${ctx}/weixin/f/autoinn/user/gouserInfo" class=" pt-10 pb-10 pl-20 pr-0 ">
						<i class="fa fa-user pt-5 f20 pr-3"></i>用户中心
					</a> 
				</div>
						<div class="cate-nav bgc-ffffff mt-0 pl-0 pr-0 col-xs-12 row  text-left" style="background-color: #f8f8f8">
			 
				  <div class="input-group">
				   	 <input type="text"  id="sou" class="form-control" id="s_company_name" name="s_company_name" placeholder="请输入关键词,如:"  >
				 	 <span class="input-group-addon bgc-EF8A55 co5" id="s_schear" onclick="return search();">搜索</span>
		</div>
				
				</div>
			

				<div class="cate-nav bgc-ffffff mt-0 pl-0 pr-0 col-xs-12 row">
				<div class="mall-cate-box">
					<ul class="mall-cate pt-5">
						<c:forEach var="navcate" items="${navCat.navtabList}">
							<c:if test="${navcate.text!='常去门店'}">
						    	<li><a href="javascript:void(0);" data-type="${navcate.dataType }">${navcate.text}<em></em></a>
							</c:if>
						</c:forEach>
						<li><span style="color:#428bca" onclick="s()">常去门店</span>
					</ul>
				</div>

				<div class="sortdrop-wrapper nav-hide " data-type="area">
					<div class="sort-wrapper">
						<div class="sort-view">
							<div>
								<c:forEach var="areaselect" items="${navCat.areaList}">
									<section
										<c:if test="${areaselect.select=='select'}">class="select"</c:if>>
										<a href="${ctx}${areaselect.href}"
											data-main="${areaselect.datamain}"> <span>${areaselect.text}</span>
											<em></em>
										</a>
									</section>
								</c:forEach>
							</div>
							<i class="m-down nav-hide"></i>
						</div>

						<c:forEach var="areaselect" items="${navCat.areaList}">
							<c:if
								test="${areaselect!=null && fn:length(areaselect.subList)>0}">
								<div class="sort-sider nav-hide"
									data-main="${areaselect.datamain}">
									<div>
										<c:forEach var="sublist" items="${areaselect.subList}">
											<section>
												<a class="submenu_handle select"
													href="${ctx}${sublist.href}"> <span>${sublist.text }</span><em></em>
												</a>
											</section>
										</c:forEach>
									</div>
									<i class="m-down hide"></i>
								</div>
							</c:if>
						</c:forEach>
					</div>
				</div>

				<div class="sortdrop-wrapper nav-hide" data-type="sort" >
					<div class="sort-wrapper">
						<div class="sort-view" >
							<div>
								<c:forEach var="sortselect" items="${navCat.sortList}">
									<section
										<c:if test="${sortselect.select=='select'}">class="select"</c:if>>
										<a href="${ctx}${sortselect.href}"> <span>${sortselect.text }</span></a>
									</section>
								</c:forEach>
							</div>
						</div>
					</div>
				</div>
				<div class="sortdrop-wrapper nav-hide" data-type="cqmd">
					<div class="sort-wrapper">
						<div class="sort-view">
							<div>
								<section class="select">
									<a href="javascript:s()"> <span>收藏门店</span></a>
								</section>
							</div>
						</div>
					</div>
				</div>
			</div>	
			</div>
			
			<div class="row pt-100 pb-50 car-wash-list">
				<div class="pop-shade nav-hide"></div>
				<div class="alert alert-info mr-5 ml-5" id="loding_msg" style="margin-top:40px">正在定位中...</div>
				
				<div class="col-xs-12 pb-15 nav-hide get-more-div">
					<button class="btn btn-lg btn-default btn-block co3 get-more" data-page_index="0">查看更多...</button>
				</div>
			</div>

			<ul class="gray-orange-a list-inline row mr-0 ml-0 mb-0 h30 w pf bgc-f8f8f8 border-1 bdc-e6e6e6" style="bottom: 0; left: 0;">
				<li class="pt-10 pb-10 pr col-xs-12 pl-0  f12">
					<i class="pa fa fa-map-marker pt-3 pl-5 co1"></i>
					<div class="pl-25 pr-15" id="m_location">正在定位中....</div>
				</li>
			</ul>
		</div>
		<input type="hidden" id="shou" value="${shou }"/>
		<script type="text/javascript">
            var PARENT_URL ='',
            	ERROR_MSG = '',
                SUCCESS_MSG = '',
                INFO_MSG = '',
                WARNING_MSG = '';
        </script>

	    <script type="text/javascript" src="${ctx}/static/js/autoinn/jquery/jquery.placeholder.js"></script>
		<script type="text/javascript" src="${ctx}/static/js/autoinn/common.js"></script>
		<script type="text/javascript" src="${ctx}/static/js/autoinn/washCar.js"></script>
		<script type="text/javascript" charset="utf-8" src="${ctx}/static/js/autoinn/slideNav.js"></script>
		<script type="text/javascript">
		//隐藏微信分享按钮
		document.addEventListener("WeixinJSBridgeReady",
				function onBridgeReady(){
					WeixinJSBridge.call("hideOptionMenu")
				}
		);
		
		//获取参数
		var area_f=$.Global.Utils.getQueryString("area_f");
		var area_sub=$.Global.Utils.getQueryString("area_sub");
		var sort=$.Global.Utils.getQueryString("sort");
		var lng=null;
		var lat=null;
		var flag = true;
		var sou = $.Global.Utils.getQueryString("sou");
		
		function zhuan(id){
			$.post(ctx+"/weixin/f/autoinn/xc/store/deltail/",{
				"id":id,
				"lng":$("#lng").val()/*
				"lat":lat*/},
			     function(data){
			
				window.location.href=ctx+data.url;
			},"json");
			
		}
		
		function search(){
			var sou = $("#sou").val();
			if(sou==""){
				alert("请填写搜索的门店!");
				return false;
			}
			window.location.href=ctx+"/weixin/f/autoinn/xc/store?sou="+sou;
			return true;
		}
		
		function s(){
			var s = $("#shou").val();
			if(s==0){
				alert("您未有收藏店铺");
			}else{
				window.location.href="${ctx}/weixin/f/autoinn/xc/collect";
			}
		}

	    $('.get-more').bind('click', function(){
		    	getData();
		 });
			
		function getData(){
			$('#loding_msg').html("正在拼命为您获取数据中");
			 var me =  $('.get-more'),
	            pageIndex = parseInt(me.data('page_index')),
	            strHtml = [
	                   	'<ul class="list-group col-xs-12  pl-15 pr-15" style="margin-top:40px">',
							'<li class="list-group-item row pl-0 pr-0 pr">',
							'<a href="javascript:zhuan(&quot;{0}&quot;);" class="mb-10">',
									'<div class="col-xs-12  pr-100  mb-10">',
										'<div class="fb f15 co7">{1}</div>',
										'<div class="f13 pt-10"><span class="pr-20 co3">{2}</span><span class="co2">免预约</span>',
										'</div>',
									'</div>',
									'<div class="pa pr-5 pl-0 text-right" style="right: 0;">',
										'<div>',
											'<i class="fa fa-rmb f13 co2"></i><span class="co2 f18 fb">{3}</span>',
											'<i class="fa  f14 co2">元起</i>',
										'</div>',
										'<div class="pt-5">',
											'<i class="f14 co1"></i><span class="f14 co1">距离</span><span class="f14 co1">{4}km</span>',
										'</div>',
									'</div>',
								'</a>',
								'<div class="bgc-ffffff mt-0 row">',
									'<div class="pt-10 pb-5 pr col-xs-6 pl-0 f16 text-center border-top border-right bdc-e6e6e6">',
										'<a class="co1" href="${ctx}/weixin/f/autoinn/xc/map?dlng={7}&&dlat={8}">',
											'<i class="pa fa fa-hand-o-right pt-3 pl-3 co1"></i>',
											'<span class="pl-25">到这去</span>',
										'</a>',
									'</div>',
									'<div class="pt-10 pb-5 pr col-xs-6 pl-0 f16 text-center border-top bdc-e6e6e6">',
										'<i class="pa fa fa-phone pt-3 pl-3 co1"></i>',
										'<span class="pl-25"><a href="tel:{5}" class="co1">{5}</a></span>',
									'</div>',
									'<a class="co8" href="${ctx}/weixin/f/autoinn/xc/map?dlng={7}&&dlat={8}">',
										'<div class="pt-10 pr col-xs-12 pl-0 border-top bdc-e6e6e6 f14">',
											'<i class="pa fa fa-map-marker pt-3 pl-10 co1"></i>',
											'<div class="pl-25 pr-15 co1">{6}</div>',
										'</div>',
									'</a>',
								'</div>',
							'</li>',
						'</ul>'
	            ].join('');
	       		g_ajax_processing_obj_id = $('.get-more').setUUID().attr('id');
	       		ajaxSend(ctx+"/weixin/f/autoinn/xc/store/pagelist",
				         {"pageNum": pageIndex + 1,
			    		  "area_f" : area_f,
			    		  "area_sub" : area_sub,
			    		  "sort" : sort,
			    		  "lng"  : lng,
			    		  "lat"  : lat,
			    		  "sou"  : sou
			    		  }, 
				          function(data){
			    			    if(data.success){
			    			    	$('#loding_msg').hide();
			    			    	 if(data.rows!=null && data.rows.length > 0){
						                    var str = "";
						                     $.map(data.rows, function(d){
						                        str += String.format(
						                            strHtml,
						                            d.id,
						                            d.name, 
						                            d.areaname, 
						                            d.xprice,
						                            d.juli,
						                            d.tel,
						                            d.address,
						                            d.lng,
						                            d.lat
						                        );
						                    }); 
						                    $(str).insertBefore(me.parent());
						                    me.data("page_index", pageIndex + 1);
						                    if(data.total>(pageIndex + 1)*10){
						                    	$(".get-more-div").show();
						                    }else{
						                    	$(".get-more-div").hide();
						                    }
						                    
						              }else{
						            	  $('#loding_msg').hide();
						            	  str= '<div class="blank10"></div><div class="alert alert-info mr-5 ml-5">暂无数据信息！</div>';
					    			      $(str).insertBefore(me.parent());
					    			     $(".get-more-div").hide();
						              }
			    			    }else {
			    			    	$('#loding_msg').hide();
			    			    	str= '<div class="blank10"></div><div class="alert alert-info mr-5 ml-5">获取数据出现错误</div>';
			    			    	$(str).insertBefore(me.parent());
			    			    	$(".get-more-div").hide();
				                }
				            }
				   ); 
		}
			
			
		function propmsg(){
			if(!flag){
				//alert("您的手机定位过慢，请在系统设置-位置服务中打开网络位置服务");
				//$('#loding_msg').html("您的手机定位过慢，请在系统设置-位置服务中打开网络位置服务或者<button onclick=\"location.reload()\">刷新重试</button>");
				//$("#m_location").html("您的手机定位过慢，请在系统设置-位置服务中打开网络位置服务");
				flag=true;
			}
		}
		
		if (window.navigator.geolocation) {
			var options = {
		     	enableHighAccuracy: true
			};
			setTimeout("propmsg()",8000);
			window.navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options);
		} else {
		       alert("浏览器不支持html5来获取地理位置信息");
		}
			
		function handleSuccess(position) {
			flag = true;
			var currentLat = position.coords.latitude;
			var currentLon = position.coords.longitude;
			var gpsPoint = new BMap.Point(currentLon, currentLat);
			 BMap.Convertor.translate(gpsPoint, 0, function(point){
				var myGeo = new BMap.Geocoder();
				myGeo.getLocation(point, function(result) {
					if (result) {
						var addComp = result.addressComponents;
						var latlngcity = addComp.city;
						lng=point.lng;
						lat=point.lat;
						$("#m_location").html(result.address);
						getData();
					} else {
						//$('#loding_msg').html("<p>抱歉，无法定位您的位置信息，请刷新重试！</p><button onclick=\"location.reload()\">刷新重试</button>");
						//$("#m_location").html("未获取到位置");
						getData();
					}
				});
			}); //转换坐标
		} 
		
		function handleError(position) {
			flag = true;
			getData();
			//$('#loding_msg').html("<p>抱歉，无法定位您的位置信息，请刷新重试！</p><button onclick=\"location.reload()\">刷新重试</button>");
			$("#m_location").html("抱歉，无法定位您的位置信息，请刷新重试！");
		} 
		</script>
		<script>
		var _hmt = _hmt || [];
		(function() {
		  var hm = document.createElement("script");
		  hm.src = "//hm.baidu.com/hm.js?3987c54e2c6d6c399fa4aca3fb9a7ef9";
		  var s = document.getElementsByTagName("script")[0]; 
		  s.parentNode.insertBefore(hm, s);
		})();
		</script>
		
	</body>
</html>